import React, { Component } from "react";
import Taro from '@tarojs/taro';
import { View,Image,Text,Button,Input } from '@tarojs/components';
import { AtButton,AtAvatar, AtModal, AtModalHeader, AtModalContent, AtModalAction,AtInput  } from 'taro-ui';
import './mineorderdet.scss'
class Mineorderdet extends Component {
    constructor () {
        super(...arguments)
        this.state = {
          isOpen:false
        }
      }
      handleClose=()=>{
        this.setState({isOpen:false})
    }
    handleCancel=()=>{
        this.setState({isOpen:false})
    }
    handleConfirm=()=>{
        this.setState({
            isOpen:false
        })
    }
    gotowuliu(){
        Taro.navigateTo({
            url: './../../pages/minewuliu/minewuliu'
          })
    }
    render () {
      return <View className='container'>
          <View className='ordet'>
              <View className='ordetop'>
                  <Text style='font-size:28px'>待支付</Text>
              </View>
              <View className='ordertop1' style='font-size:18px'>
                  <View>
                  <Text>拼团公社自营店 2017061297569897</Text>
                  </View>
                    <View>
                           <Text>待付款</Text> 
                        </View>
                </View>
                    <View className='ordermid1'>
                      
                        <View className='orderimg'>
                            <Image src='https://gd4.alicdn.com/imgextra/i3/2867278025/O1CN01RenrlA299V2etFS0V_!!2867278025.jpg' style='height:150px;width:150px'></Image>
                        </View>
                           <View>
                              <View className='ordername'>
                             <Text>太平鸟马海毛毛衣女2020春季新款中长款圆领宽松黑色渐变针织衫</Text>   
                           </View>
                           <View className='oderimgtext'>
                                <Text >X1</Text>  
                          </View> 
                          <AtButton className='middet' >查看团详情</AtButton>
                           </View>
                       
                    </View>
                    <View className='ordermid2' style='font-size:20px'>
                        <Text>实付：</Text>
              <Text>￥341</Text>
                    </View>
                    <View className='ordebottom' >
                        <View className='bottomlianxi'>
                            <Text>联系卖家</Text>
                        </View>
                        <View onClick={()=>this.setState({isOpen:true})}>
                            <Text>拨打电话</Text>
                        </View>
                    </View>
                    <View className='orderdets' style='font-size:20px'>
                        <View>
                            <Text>订单编号：1426452050</Text>
                        </View>
                        <View>
                            <Text>支付方式：微信支付</Text>
                        </View>
                        <View>
                            <Text>下单时间：2020-11-11 11:11:11</Text>
                        </View>
                    </View>
                    <View className='ordebottom1'>
                        <AtButton className='bottompay' onClick={this.gotowuliu}>去支付</AtButton>
                        <AtButton className='bottomcancle'>取消订单</AtButton>
                        
                    </View>
          </View>
          <AtModal
  isOpened={this.state.isOpen}
>
<AtModalHeader></AtModalHeader>
  <AtModalContent>
  确定拨打电话123456725吗？
  </AtModalContent>
  <AtModalAction> <Button onClick={ this.handleCancel }>取消</Button> <Button onClick={ this.handleConfirm }>确定</Button> </AtModalAction>
</AtModal>
          </View>
          
    }
  }
  
  export default Mineorderdet